<template>
  <el-form-item label="选择样式" class="xFstyleProps">
    <el-select v-model="tempValue" size="mini">
      <el-option v-for="(item, idx) in list" :key="idx" :label="item.name" :value="item.value"></el-option>
    </el-select>
  </el-form-item>
</template>

<script>
export default {
  name: 'attr-sxc-timeFormat',
  props: {
    timeFormat: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      list: [{
        name: '年-月-日 星期 时间',
        value: 'YYYY-MM-DD dddd HH:mm:ss'
      }, {
        name: '年-月-日',
        value: 'YYYY-MM-DD'
      }, {
        name: '星期',
        value: 'dddd'
      }, {
        name: '时间',
        value: 'HH:mm:ss'
      }, {
        name: '星期 时间',
        value: 'dddd HH:mm:ss'
      }, {
        name: '年-月-日 星期',
        value: 'YYYY-MM-DD dddd'
      }, {
        name: '年-月-日 时间',
        value: 'YYYY-MM-DD HH:mm:ss'
      }],
      tempValue: ''
    }
  },
  mounted () {
    this.tempValue = this.timeFormat
  },
  watch: {
    timeFormat (val) {
      this.tempValue = val
    },
    tempValue () {
      this.$emit('update:timeFormat', this.tempValue)
    }
  }
}
</script>
